<template>
    <a-card :bordered="false">
        <!-- 查询区域 -->
        <div class="table-page-search-wrapper">
            <a-form layout="inline" @keyup.enter.native="searchQuery">
                <a-row :gutter="24">
                     <a-col :md="6" :sm="8">
                        <a-form-item label="成果编号">
                            <a-input placeholder="请填写成果编号" v-model="queryParam.cxj_xmbh"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <a-form-item label="成果名称">
                            <a-input placeholder="请填写成果名称" v-model="queryParam.cxj_mc_zw"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <a-form-item label="形审结果">
                            <a-select v-model="queryParam.xssc_jg" placeholder="请选择形审结果">
                                <a-select-option value="">请选择</a-select-option>
                                <a-select-option value="301">待形审</a-select-option>
                                <a-select-option value="302">材料补正</a-select-option>
                                <a-select-option value="303">不通过</a-select-option>
                                <a-select-option value="304">通过</a-select-option>
                                <a-select-option value="305">材料补正已提交</a-select-option>
                            </a-select>
                            <!-- <a-input placeholder="请填写形审结果" v-model="queryParam.xmzt_mc"></a-input> -->
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <a-form-item label="形审人">
                            <a-input placeholder="请填写形审人" v-model="queryParam.zj_xm"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <a-form-item label="年份">
                            <a-date-picker
                                mode="year"
                                v-model="queryParam.shijian"
                                format="YYYY"
                                :open='yearShowOne'
                                @openChange="openChangeOne"
                                @panelChange="onYearChange"
                                placeholder="请选择年份"
                            />
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                            <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                            <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
                        </span>
                    </a-col>
                </a-row>
            </a-form>
        </div>
        <!-- 查询区域-END -->
        <!-- 操作按钮区域 -->
        <div class="table-operator"></div>
        <!-- table区域-begin -->
        <div>
            <a-table
                tableLayout="auto"
                ref="table"
                size="middle"
                :scroll="{x:1275}"
                bordered
                :rowKey="(r,i)=>{i.toString()}"
                :columns="columns"
                :dataSource="dataSource"
                :pagination="ipagination"
                :loading="loading"
                class="j-table-force-nowrap"
                @change="handleTableChange">
                <span slot="action" slot-scope="text, record">
                    <a @click="viewDetail(record)">查看</a>
                </span>
            </a-table>
        </div>
        <cxj-xssc-all-history ref="modalForm" :expertFlag="expertFlag" :recordId="recordId" :flId="fl_id" :cxjXszt="cxj_xszt"></cxj-xssc-all-history>
    </a-card>
</template>

<script>

import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { cxjsbGetSbtjdw } from '@/api/shenbao';
import { getAction, postAction,queryXsscMxByXsscId } from '@/api/manage';
import { ACCESS_TOKEN } from "@/store/mutation-types"
import moment from 'moment'
import Vue from 'vue'
import {
    queryByFlId,
} from "@/api/api"
import {
    exportTjcgXls,
    TjcgUpLoad
} from "@/api/login";
import {
    cxjsbTjdwlist,
    cxjsbSsjtlist,
    cxjsbTjdwlbListAll,
    cxjsbTjdwlistBylb,
    sysCxjFlCxjsbList,
} from "@/api/api"
import {
    queryHistoryAll
} from "@/api/manage"
import CxjXsscAllHistory from './modules/CxjXsscAllHistory'

export default {
    name: 'CxjTjTjyjList',
    mixins:[mixinDevice],
    components: {
        CxjXsscAllHistory
    },
    data () {
        return {
            description: '形审记录页面',
            year: "",
            // 表头
            columns: [
                {
                    title: '序号',
                    align: "center",
                    dataIndex: '',
                    width: 60,
                    customRender: function (t,r,index) {
                        return parseInt(index)+1;
                    }
                },
                {
                    title:'成果编号',
                    align:"center",
                    dataIndex: 'cxj_xmbh',
                     width: 100,
                },
                {
                    title:'成果名称',
                    align:"center",
                    dataIndex: 'cxj_mc_zw',
                    width: 320,
                },
                {
                    title:'形审结果',
                    align:"center",
                    dataIndex: 'xssc_jg',
                    customRender: function(id){
                        return id == 301 ? '待形审': id == 302?'材料补正':id == 303?'不通过':id==304?'通过':id==305?'材料补正已提交':id==0?'暂存':''
                    },
                     width: 100,
                },
                {
                    title:'形审人',
                    align:"center",
                    dataIndex: 'zj_xm',
                    width: 120,
                },

                {
                    title:'时间',
                    align:"center",
                    dataIndex: 'create_time',
                    width: 150,
                },
                {
                    title: '操作',
                    dataIndex: 'action',
                    align: "center",
                    fixed: "right",
                    width: 60,
                    scopedSlots: { customRender: 'action' }
                }
            ],
            url: {
                list: "/cxj/cxjXssc/queryHistoryAll",
                // delete: "/cxj/cxjTjTjyj/delete",
                // deleteBatch: "/cxj/cxjTjTjyj/deleteBatch",
                // exportXlsUrl: "/cxj/cxjTjTjyj/exportXls",
                // importExcelUrl: "cxj/cxjTjTjyj/importExcel",
                // sbdwUrl: '/cxj/cxjSbSbdw/cxjsb_getSbtjdw'
            },
            dictOptions:{},
            superFieldList:[],
            fileStatus: "",
            gzsc_percent_flag:false,
            gzsc_percent: 0,
            // 推荐单位
            recommenderTypeData: [],
            // 所属集团
            groupData: [],
            recommenderData: [],
            yearShowOne: false,
            sbnd: moment(new Date()).format('YYYY'),
            selectedRowKeys: [],
            selectionRows: [],
            queryParam: {},
            loading: false,
            isorter: {
                column: 'createTime',
                order: 'desc',
            },
            dataSource: [],
            ipagination: {
                current: 1,
                pageSize: 10,
                pageSizeOptions: ['10', '20', '30'],
                showTotal: (total, range) => {
                    return range[0] + "-" + range[1] + " 共" + total + "条"
                },
                showQuickJumper: true,
                showSizeChanger: true,
                total: 0
            },
            cxjSbList: [],
            expertFlag: false,
            recordId: '',
            fl_id: '',
            cxj_xszt: ''
        }
    },
    created() {
        this.$set(this.dictOptions, 'isValid', [{text:'是',value:'Y'},{text:'否',value:'N'}])
        this.getsysCxjFlCxjsbList();
        this.getSuperFieldList();
        this.getCxjsbTjdwlbList();
        this.getCxjsbSsjtlist();
        this.loadData();
        this.queryParam.shijian = moment().format('YYYY');
        console.log('=====',this.queryParam.shijian)
        // this.getCxjsbTjdwlist();
    },
    computed: {
        importExcelUrl: function(){
            return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
        },
    },
    methods: {
        moment,
        getsysCxjFlCxjsbList(){
            sysCxjFlCxjsbList(null).then(res=>{
                if (res.success) {
                    this.cxjSbList = res.result;
                }
            })
        },
        handleTableChange(pagination, filters, sorter) {
            //分页、排序、筛选变化时触发
            //TODO 筛选
            if (Object.keys(sorter).length > 0) {
                this.isorter.column = sorter.field;
                this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
            }
            this.ipagination = pagination;
            this.loadData();
        },
        modalFormOk() {
            // 新增/修改 成功时，重载列表
            this.loadData();
            //清空列表选中
            this.onClearSelected()
        },
        onSelectChange(selectedRowKeys, selectionRows) {
            this.selectedRowKeys = selectedRowKeys;
            this.selectionRows = selectionRows;
        },
        onClearSelected() {
            this.selectedRowKeys = [];
            this.selectionRows = [];
        },
        searchQuery() {
            this.loadData(1);
        },

        searchReset() {
            this.queryParam = {};
            this.sbnd = moment(new Date()).format('YYYY');
            this.queryParam.shijian = this.sbnd;
            this.loadData(1);
        },
        getQueryField() {
            //TODO 字段权限控制
            var str = "id,";
            this.columns.forEach(function (value) {
                str += "," + value.dataIndex;
            });
            return str;
        },
        loadData(arg) {
            /* if (!this.url.list) {
                this.$message.error("请设置url.list属性!")
                return
            } */
            //加载数据 若传入参数1则加载第一页的内容
            if (arg === 1) {
                this.ipagination.current = 1;
            }
            // var params = this.getQueryParams();//查询条件
            this.loading = true;
            this.queryParam.shijian = this.sbnd;
            let params = Object.assign(this.queryParam, this.isorter, this.filters)
            params.field = this.getQueryField();
            params.pageNo = this.ipagination.current;
            params.pageSize = this.ipagination.pageSize;
            // console.log(params, '1232')
            queryHistoryAll(params).then(res=>{
                if (res.success) {
                    //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
                    this.dataSource = res.result.records || res.result;
                    if (res.result.total) {
                        this.ipagination.total = res.result.total;
                    } else {
                        this.ipagination.total = 0;
                    }
                    //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
                }
                if (res.code === 510) {
                    this.$message.warning(res.message)
                }
                this.loading = false;
            })
            /* postAction(this.url.list, params).then((res) => {
                if (res.success) {
                    //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
                    this.dataSource = res.result.records || res.result;
                    if (res.result.total) {
                        this.ipagination.total = res.result.total;
                    } else {
                        this.ipagination.total = 0;
                    }
                    //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
                }
                if (res.code === 510) {
                    this.$message.warning(res.message)
                }
                this.loading = false;
            }) */
        },
        // 弹出日历和关闭日历的回调
        openChangeOne(status){
            //status是打开或关闭的状态
            if(status){
                this.yearShowOne =  true
            }
        },
        // 得到年份选择器的值
        onYearChange(value){
            // let params = this.getQueryParams();//查询条件
            // params.sbnd = moment(value).format('YYYY');
            this.sbnd = moment(value).format('YYYY');
            this.queryParam.shijian = moment(value).format('YYYY');
            this.yearShowOne = false;
        },

        initDictConfig(){},
        getSuperFieldList(){
            let fieldList=[];
            fieldList.push({type:'string',value:'cxj_xmbh',text:'成果编号',dictCode:''})
            fieldList.push({type:'string',value:'cxj_mc_zw',text:'成果名称',dictCode:''})
            fieldList.push({type:'string',value:'fl_id',text:'成果类别',dictCode:''})
            fieldList.push({type:'string',value:'sbdw_qymc',text:'申报单位',dictCode:''})
            fieldList.push({type:'string',value:'cxj_qssj',text:'起始时间',dictCode:''})
            fieldList.push({type:'string',value:'cxj_wcsj',text:'完成时间',dictCode:''})
            fieldList.push({type:'string',value:'wcrlist',text:'完成人',dictCode:''})
            fieldList.push({type:'string',value:'wcdwlist',text:'完成单位',dictCode:''})
            fieldList.push({type:'string',value:'tjzt',text:'推荐状态',dictCode:''})
            fieldList.push({type:'switch',value:'isValid',text:'是否有效'})
            this.superFieldList = fieldList;
        },
        viewDetail(item){
            this.expertFlag = !this.expertFlag;
            this.recordId = item.id;
            this.fl_id = item.fl_id;
            this.cxj_xszt = item.cxj_xszt;
            console.log(item)
            // this.getqueryByFlId(item.fl_id, item.cxj_xszt);
            // let token = Vue.ls.get(ACCESS_TOKEN);
            // sessionStorage.setItem('token', token);
            //  let routeData = this.$router.resolve({
            //     path: '/shenbao/declare',
            //     query: {
            //         type: item.fl_id,
            //         cxj_cxj_id: item.id,
            //         isHead: 2,
            //         from: 'gly'
            //     }
            // });
            // window.open(routeData.href, '_blank');
        },

        // 获取推荐单位类别列表
        getCxjsbTjdwlbList(){
          cxjsbTjdwlbListAll().then(res=>{
                if (res.success) {
                    this.recommenderTypeData = res.result;
                }
            })
        },
        handleTjdwlb(val){
            this.recommenderData = [];
            cxjsbTjdwlistBylb({
                jttjdw_lb: val
            }).then(res=>{
                console.log('123123123123',res)
                if (res.success) {
                    this.recommenderData = res.result;
                }
            })
        },
        // 获取所属集团数据
        getCxjsbSsjtlist(){
            cxjsbSsjtlist().then(res=>{
                if (res.success) {
                    this.groupData = res.result;
                }
            })
        },
        exportTjcgXls() {
            let that = this;
            exportTjcgXls().then(res=>{
                that.downfn('推荐成果汇总表',res);
            })
        },
        TjcgUpLoad() {
            const choosefile = document.querySelector('#gzsc');
            choosefile.click();
        },
        handlegzsc() {
            let that = this;
            that.gzsc_percent = 0;
            that.gzsc_percent_flag = true;
            const files = document.getElementById('gzsc').files[0];
            if (files) {
                // if (files.size > 50*1024*1024) { // 此处判断上传文件的大小 , 单位为 b 故要乘以两个1024
                //     this.$message.warning('文件最大为50兆')
                //     return
                // }
                if(window.FileReader) {
                    var fr = new FileReader();
                    fr.onprogress = function(e) {
                        that.gzsc_percent = (e.loaded/files.size)*100;
                    };
                    fr.readAsDataURL(files);
                }
                let formData = new FormData();
                formData.append('file', files);
                TjcgUpLoad(formData).then(res=>{
                    let data = res.data;
                    that.gzsc_percent_flag = false;
                    if (res.code == '200') {
                        document.getElementById('gzsc').value = null;
                        that.$message.success('上传成功');
                    } else {
                        that.$message.error(data.message);
                    }
                }).catch(err=>{
                    that.gzsc_percent_flag = false;
                })
            }
        },
        downfn(filename, res) {
            var blob = res;
            if (window.navigator.msSaveOrOpenBlob) {
                navigator.msSaveBlob(blob, filename);
            } else {
                var a = document.createElement('a');
                var url =  window.URL.createObjectURL(blob);
                a.href = url;
                a.download = filename+'.xls';
                document.body.appendChild(a);
                a.click();
                window.URL.revokeObjectURL(url);
            }
        },
    }
}
</script>
<style scoped lang="less">
    @import '~@assets/less/common.less';
    .table-operator {
        span {
            color: #252525;
            line-height: 20px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-size: 14px;
            display: inline-block;
            margin-right: 18px;
        }
    }
    /deep/.ant-table-thead > tr > th .ant-table-header-column {
      width:100%;
      text-align: center!important;
    }
    /deep/.ant-table-thead > tr > th {
      font-size: 14px!important;
      padding:8px 3px!important;
    }
    /deep/.ant-table-tbody > tr > td {
      word-break: break-all;
      white-space: normal;
      word-wrap:break-word;
      font-size:14px;
      padding:3px 3px!important;
    }
</style>